<template>
    <view class="wish-ava">
        <img :src="props.url" alt="" :class="imgClass">
    </view>
</template>
<script lang="ts" setup>
import {computed, onMounted, reactive, ref, onUnmounted, PropType } from 'vue';

const A = ref(0);

const B = reactive({})

const props = defineProps({
  size: {
    type: String as PropType<'large' | 'middle' | 'small'>,
    default: 'middle',
  },
  url: {
    type: String,
    default: 'https://img1.baidu.com/it/u=454833630,2354447084&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1684688400&t=dac6a82b458f8d4997bf3e2a41e76f00',
  }
});

const imgClass = computed(()=>{
    let result = `img-${props.size}`;

    return result
})


onMounted(() => {

})

onUnmounted(() => {

})

</script>

<style lang="scss" scoped>
.wish-ava{
  height: 100%;
    .img-middle{
        width: 100rpx;
        height: 100rpx;
        border-radius: 50%;
    }
    .img-small{
      width: 50rpx;
        height: 50rpx;
        border-radius: 50%;
    }
}
</style>